<template>
    <el-dialog
        title="对账单详情"
        :visible.sync="dialogVisible"
        :before-close="closeDialog"
        width="70%"
        :close-on-click-modal="false"
        :append-to-body="true"
    >
        <div
            v-loading="loading"
            class="task-zd-table"
        >
            <table
                cellspacing="0"
                cellpadding="0"
                border="1"
                width="100%"
                bordercolor="cornflowerblue"
            >
                <tr align="left">
                    <td
                        style="height: 60px; background-color: #CCCCCC;"
                        colspan="2"
                    >
                        接入方对账单：
                    </td>
                    <td
                        style="width:200px; background-color: #CCCCCC;"
                        colspan="2"
                    >
                        提供方对账单：
                    </td>
                </tr>

                <tr align="left">
                    <td style="width:200px; height: 40px">
                        对账单编号
                    </td>
                    <td>{{ receiverData.statementNumber }}</td>
                    <td style="width:200px; height: 40px">
                        对账单编号
                    </td>
                    <td>{{ providerData.statementNumber }}</td>
                </tr>
                <tr align="left">
                    <td>接入方编号</td>
                    <td>{{ receiverData.accessNumber }}</td>
                    <td>提供方编号</td>
                    <td>{{ providerData.provideNumber }}</td>
                </tr>
                <tr align="left">
                    <td>提供方编号</td>
                    <td>{{ receiverData.provideNumber }}</td>
                    <td>接入方编号</td>
                    <td>{{ providerData.accessNumber }}</td>
                </tr>
                <tr align="left">
                    <td>数据项集名称</td>
                    <td>{{ receiverData.dataItemSetsName }}</td>
                    <td rowspan="2">
                        表名称
                    </td>
                    <td rowspan="2">
                        {{ providerData.tableName }}
                    </td>
                </tr>
                <tr align="left">
                    <td>业务系统</td>
                    <td>{{ receiverData.systemName }}</td>
                </tr>
                <tr align="left">
                    <td>资源编号</td>
                    <td>{{ receiverData.resourceNumber }}</td>
                    <td>表编号</td>
                    <td>{{ providerData.tableCode }}</td>
                </tr>
                <tr align="left">
                    <td>原始库条数</td>
                    <td>{{ receiverData.dataCount }}</td>
                    <td rowspan="2">
                        数据条数
                    </td>
                    <td rowspan="2">
                        {{ providerData.dataCount }}
                    </td>
                </tr>
                <tr align="left">
                    <td>废止库条数</td>
                    <td>{{ receiverData.discarddbCount }}</td>
                </tr>
                <tr align="left">
                    <td>数据指纹</td>
                    <td>{{ receiverData.dataFinger }}</td>
                    <td>数据指纹</td>
                    <td>{{ providerData.dataFinger }}</td>
                </tr>
                <tr align="left">
                    <td>指纹类型</td>
                    <td>{{ receiverData.fingerType }}</td>
                    <td>指纹类型</td>
                    <td>{{ providerData.fingerType }}</td>
                </tr>
                <tr align="left">
                    <td>数据大小</td>
                    <td>{{ receiverData.dataSize }}</td>
                    <td>数据大小</td>
                    <td>{{ providerData.dataSize }}</td>
                </tr>
                <tr align="left">
                    <td>原始库起始编号</td>
                    <td>{{ receiverData.startLocation }}</td>
                    <td rowspan="2">
                        起始编号
                    </td>
                    <td rowspan="2">
                        {{ providerData.startLocation }}
                    </td>
                </tr>
                <tr align="left">
                    <td>原始库结尾编号</td>
                    <td>{{ receiverData.endLocation }}</td>
                </tr>
                <tr align="left">
                    <td>废止库起始编号</td>
                    <td>{{ receiverData.discardStartLocation }}</td>
                    <td rowspan="2">
                        结尾编号
                    </td>
                    <td rowspan="2">
                        {{ providerData.endLocation }}
                    </td>
                </tr>
                <tr align="left">
                    <td>废止库结尾编号</td>
                    <td>{{ receiverData.discardEndLocation }}</td>
                </tr>
                <tr align="left">
                    <td>来源存储位置</td>
                    <td>{{ receiverData.sourceStoryLocation }}</td>
                    <td>来源存储位置</td>
                    <td>{{ providerData.sourceStoryLocation }}</td>
                </tr>
                <tr align="left">
                    <td>账单状态</td>
                    <td>{{ receiverData.statementStatus | statementStatusHandel }}</td>
                    <td>账单状态</td>
                    <td>{{ providerData.statementStatus | statementStatusHandel }}</td>
                </tr>
                <tr align="left">
                    <td>上次失败账单号</td>
                    <td>{{ receiverData.statementFailedNumber }}</td>
                    <td>上次失败账单号</td>
                    <td>{{ providerData.statementFailedNumber }}</td>
                </tr>
                <tr align="left">
                    <td>接入时间</td>
                    <td>{{ receiverData.accessTime }}</td>
                    <td>发送时间</td>
                    <td>{{ providerData.accessTime }}</td>
                </tr>
                <tr align="left">
                    <td>对账时间</td>
                    <td>{{ receiverData.statementTime }}</td>
                    <td>对账时间</td>
                    <td>{{ providerData.statementTime }}</td>
                </tr>
                <tr align="left">
                    <td>对账方法</td>
                    <td>{{ receiverData.statementMethod | statementMethodHandel }}</td>
                    <td>对账方法</td>
                    <td>{{ providerData.statementMethod | statementMethodHandel }}</td>
                </tr>
                <tr align="left">
                    <td>对账单类型</td>
                    <td>{{ receiverData.statementType | statementTypeHandel }}</td>
                    <td>对账单类型</td>
                    <td>{{ providerData.statementType | statementTypeHandel }}</td>
                </tr>
                <tr align="left">
                    <td>对账结果</td>
                    <td>{{ receiverData.statementResult | statementResultHandel }}</td>
                    <td>对账结果</td>
                    <td>{{ providerData.statementResult | statementResultHandel }}</td>
                </tr>
                <tr align="left">
                    <td>接入方管理员</td>
                    <td>{{ receiverData.manageUnitPerson }}</td>
                    <td>提供方管理员</td>
                    <td>{{ providerData.manageUnitPerson }}</td>
                </tr>
                <tr align="left">
                    <td>联系电话</td>
                    <td>{{ receiverData.manageUnitPhone }}</td>
                    <td>联系电话</td>
                    <td>{{ providerData.manageUnitPhone }}</td>
                </tr>
                <tr align="left">
                    <td>数据源类型</td>
                    <td>{{ receiverData.datasourceType }}</td>
                    <td>数据源类型</td>
                    <td>{{ providerData.datasourceType }}</td>
                </tr>
                <tr align="left">
                    <td>接入源名称</td>
                    <td>{{ receiverData.sourceName }}</td>
                    
                </tr>
            </table>
        </div>
        <span
            slot="footer"
            class="dialog-footer"
        >
            <el-button
                type="primary"
                @click="closeDialog"
            >取消</el-button>
        </span>
    </el-dialog>
</template>

<script>
import { statementAccountDetail } from '@/api/databaseManagement';

export default {
    data() {
        return {
            dialogVisible: false,
            loading: false,
            receiverData: [],
            providerData: [],
        };
    },
    created() {},
    methods: {
        openDialogVisible(obj) {
            this.dialogVisible = true;
            this.loading = true;
            statementAccountDetail(obj).then((res) => {
                this.loading = false;
                if (res.data.resultCode == 0) {
                    this.receiverData = res.data.data.receiver;
                    this.providerData = res.data.data.provider;
                } else {
                    this.$message.error(res.data.resultMessage);
                }
            })
                .catch((err) => {
                    this.loading = false;
                });
        },
        closeDialog() {
            this.dialogVisible = false;
            this.receiverData = [];
            this.providerData = [];
        },
    },
    filters: {
        statementStatusHandel(type) {
            if (type === '0') {
                return '未对账';
            } if (type === '1') {
                return '对账成功';
            } if (type === '2') {
                return '对账失败';
            } if (type === '3') {
                return '已销帐';
            }
            return '--';
        },
        statementMethodHandel(type) {
            if (type === '1') {
                return '即时对账';
            } if (type === '2') {
                return '盘点对账';
            }
            return '--';
        },
        statementTypeHandel(type) {
            if (type === '1') {
                return '接入方对账单';
            } if (type === '2') {
                return '发送方对账单';
            }
            return '--';
        },
        statementResultHandel(type) {
            if (type === '0') {
                return '失败';
            } if (type === '1') {
                return '成功';
            }
            return '--';
        },
    },
};
</script>
<style lang="scss" scoped>
.task-zd-table {
  height:580px;
  padding-right:16px;
  overflow-y:auto;
}
.task-zd-table table {
  background-color: #ffffff;
  border-collapse: collapse;
}
.task-zd-table table tr td,
table tr th {
  border: solid 1px #dcdfe6;
  padding: 15px;
}
.dialog-footer{
  margin-right:20px;
}
/deep/{
.el-dialog__header{
  display: flex;
  .el-dialog__title{
    color: #0090ff;
  }
}
.el-dialog{
  margin-top: 5vh!important;
}
}
</style>
